<template>
	<view>
		<view class="page">

			<u-swiper :list="info.images" height="400" mode="dot" @click="clkBanner"></u-swiper>


			<view class="u-padding-20 u-flex u-row-between" style="background: #fff;">
				<view>
					<view class="u-font-weight">{{info.name}}</view>
					<view style="color: #00C08D;margin-top: 20rpx;">
						￥{{info.price}}/{{info.service_duration}}分钟
					</view>
				</view>
				
				<view   v-if="index==0" v-for="(item,index) in info.technician" :key="index">
					<view class="u-flex">
						<view style="color: #00C08D;margin-right: 20rpx;">{{item.nickname}}</view>
						<view>
							<u-image :src="item.avatar" width="80" height="80" shape="circle"></u-image>
						</view>
					</view>
				</view>

			</view>
			
			
			
			<view style="margin-top: 20rpx;">
				<view>
					<u-tabs @change="Ctabs" :is-scroll="false"  :list="tabs" :current="current" active-color="#00C08D"></u-tabs>
				</view>
				
				<view class="u-border-top" style="padding: 30rpx;background: #fff;color: #666;">
					<view v-if="current==0">
						<u-parse :html="info.describe_content"></u-parse>
						
						
					</view>
					<view  v-if="current==1">
						<u-parse :html="info.order_describe_content"></u-parse>
					</view>
					
				</view>
				
				
			</view>
			
			
			
			<view class="bottomBtn" @click="">
				<view class="u-margin-left-30" >
					合计：<text style="color:#00C08D ;">￥{{info.price}}</text>
				</view>
				<view @click="submit" class="" style="color: #fff; background: #00C08D;text-align: center;width: 200rpx;">
				   	提交订单
				</view>
			</view>

		</view>
	</view>



</template>

<script>
	export default {
		data() {
			return {
				id: '',
				technician_id:'',
				info: {

				},
				current:0,
				tabs:[{
					name:"项目介绍"
				},{
					name:"下单说明"
				}]
			}
		},
		onLoad(options) {
			if (options.id) {
				this.id = options.id;
			}
			if (options.tid) {
				this.technician_id = options.tid;
			}
			
			
			this.jiazai()
		},
		methods: {
			jiazai() {
				this.$u.post('/project/details', {
					id: this.id,
					technician_id:this.technician_id
				}).then(res => {

					let images = res.images.split(',');
					let arr = [];
					images.forEach(item => {
						arr.push(this.$Url(item))
					})
					this.info = res;
					this.info.images = arr;

				}).catch(err => {})
			},
			Ctabs(e){
				this.current=e
			},
			submit(e){
				uni.navigateTo({
					url:'/pages/sure/index?id='+this.id+'&tid='+this.technician_id
				})
				
			}
		}
	}
</script>

<style>
	.page {
		background: #F1F1F1;
		height: 100vh;
	}
	
	.bottomBtn{
		background: #fff;
		position: fixed;
       bottom: 0;
	   width: 750rpx;
	   left: 0;
	   border-bottom: 1rpx solid #F1F1F1;
	   display: flex;
	   height:100rpx;
	   justify-content: space-between;
	   line-height: 100rpx;
	}
</style>
